new Vue({
    el: '#app',
    data: {
        problems: [],        // 存储问题数据
        loading: false,      // 加载状态
        error: null          // 错误信息
    },
    beforeMount() {
        this.fetchProblems(); // 初始化时加载问题
    },
    methods: {
        async fetchProblems() {
            try {
                this.loading = true; // 设置加载状态
                this.error = null;   // 清空错误信息

                // 模拟从 API 获取数据
                const response = await fetch('/questions_data');
                const data = await response.json();

                // 模拟数据处理（如果有需要）
                this.problems = data;
            } catch (error) {
                // 处理错误
                this.error = 'Failed to load problems. Please try again later.';
                console.error('Error fetching problems:', error);
            } finally {
                // 无论成功或失败，都停止加载状态
                this.loading = false;
            }
        },
        goToProblem(problem) {
            // 假设每个问题都有一个链接
            const qid=problem.qid;
            window.open('/question_page?qid='+qid, '_self');
        }
    }
});